
// import OL from '../utils/OpenlayerUtil/OL';

// export default {
//   data() {
//     return {
//       ol: null,
//       map: null,
//       zoom: 14,
//       editor: null,
//       draw: null,
//       layer: [],
//       lines: [],
//       markers: [],
//       layerGlobalId: 100
//     }
//   },
//   methods: {
//     initMap() {
//       // console.log(TileLayer);
//       // this.map = new Map({
//       //   layers: [
//       //     new TileLayer({
//       //       visible: true,
//       //       source: new XYZ({
//       //         visible: true,
//       //         url: 'http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}',
//       //       })
//       //     })
//       //   ],
//       //   target: 'mapDiv',
//       //   view: new View({
//       //     center: [118.7913, 32.06069],
//       //     zoom: 8,
//       //     maxZoom: 18,
//       //     projection: 'EPSG:3857',
//       //     constrainResolution: true,  // 设置缩放级别为整数
//       //     smoothResolutionConstraint: false,  // 关闭无级缩放地图
//       //   }),
//       // });
//       this.ol = new OL({ targetEle: 'mapDiv', center: [118.7913, 32.06069], zoom: 6, minZoom: 2, maxZoom: 18 });
//       this.ol.init();
//       this.map = this.ol.mapObj;
//       // this.ol.createMarker('11', [118.7913, 32.06069], 'http://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png')
//       // const that = this;
//       // // BM.Config.HTTP_URL = 'http://192.168.31.32:9000';
//       // BM.Config.HTTP_URL = process.env.VUE_APP_BIGEMAP_URL;
//       // this.map = BM.map('mapDiv', 'bigemap.tian-map', { center: [32.06069, 118.7913], zoom: this.zoom, zoomControl: true, fadeAnimation: false });
//       // var tianMapStreet = BM.tileLayer('bigemap.tian-mapstreets');
//       // tianMapStreet.addTo(this.map);
//       // this.draw = new BM.Plot.Draw(this.map, {
//       //   repeat: !0,
//       //   absorb: { distance: 10, marker: BM.circleMarker([0, 0], { radius: 6, weight: 1, fillOpacity: 1, fillColor: "white" }) },
//       //   doubleArrow: { color: "pink" },
//       //   polyline: { weight: 10 }
//       // });
//       // this.editor = new BM.Plot.Edit(this.map, {
//       //   absorb: {
//       //     distance: 10,
//       //     marker: BM.circleMarker([0, 0], { radius: 6, weight: 1, fillOpacity: 1, fillColor: "white" })
//       //   }, circle: {
//       //     icon: [!1, BM.divIcon({ html: "<span></span>" })], editable: function (e, a) {
//       //       if (0 === a.index) return !0;
//       //       var i = this.map.distance(a.path[0], a.path[1]);
//       //       return i > 20 && i < 600
//       //     }
//       //   }
//       // });
//       // this.draw.on('bm_draw_end', ((e) => {
//       //   // 监听绘图结束事件
//       //   that.layer.push(e.detail.layer);
//       //   if (window.eventBus != undefined) {
//       //     window.eventBus.$emit('onDrawEnd', e.detail.path, e.detail.type == 'circle' ? e.detail.layer.getRadius() : 0);
//       //   }
//       //   that.draw && that.draw.disable();
//       //   that.editor && that.editor.disable();
//       //   if (that.onDrawEndEvent != undefined) {
//       //     that.onDrawEndEvent(e.detail.layer);
//       //   }
//       // }))
//     },
//     addMarker(id, center, options) {
//       options = options || {};
//       let marker = this.ol.createMarker(`marker-${id}`, [center[1], center[0]], options.icon)
//       return marker;
//     },
//     addMarkerWithPopup(center, popup, options = {}) {
//       let id = ++this.layerGlobalId;
//       let marker = this.addMarker(id, center, options);
//       console.log(marker)
//       marker.element.onclick = (e) => {
//         console.log(e);
//         this.ol.createPopup(id, [center[1], center[0]], popup)
//       }
//       // this.map.on('singleclick', (e) => {
//       //   console.log(e)
//       //   var feature = this.map.forEachFeatureAtPixel(e.pixel, (feature) => {
//       //     return feature;
//       //   });
//       //   console.log(feature)
//       //   if (feature) {
//       //     console.log(feature)
//       //     // 存在元素,将弹窗显示在当前位置
//       //     this.ol.setPopup(id, center, popup)
//       //   }
//       // })
//       // this.ol.createPopupWithCoordinate(id, [center.longitude, center.latitude], popup)
//     },
//     drawPolygon() {
//       this.editor.isEdit() && this.editor.disable(), this.draw.enable("polygon")
//     },
//     drawCircle() {
//       this.editor.isEdit() && this.editor.disable(), this.draw.enable("circle")
//     },
//     drawFreePolygon() {
//       this.editor.isEdit() && this.editor.disable(), this.draw.enable("freePolygon")
//     },
//     drawRectangle() {
//       this.editor.isEdit() && this.editor.disable(), this.draw.enable("rectangle")
//     },
//     drawSector() {
//       this.editor.isEdit() && this.editor.disable(), this.draw.enable("sector")
//     },
//     clearDraw() {
//       if (this.layer.length != 0) {
//         this.layer.forEach(layer => {
//           this.map.removeLayer(layer);
//         })
//       }
//       if (this.markers.length > 0) {
//         this.markers.forEach((m) => {
//           m.remove();
//         });
//         this.markers = [];
//       }
//     },
//     setMark(location, options, popup) {
//       if (location.latitude == null || location.longitude == null) {
//         return false;
//       }
//       if (popup == undefined) {
//         var marker = this.addMarker(
//           [location.latitude, location.longitude], options
//         );
//       } else {
//         var marker = this.addMarkerWithPopup(
//           [location.latitude, location.longitude], popup, options
//         );
//       }
//       return marker;
//     },
//     renderMarkers(locations, options, clearOld = true) {
//       if (this.markers.length > 0 && clearOld) {
//         this.markers.forEach((m) => {
//           m.remove();
//         });
//         this.markers = [];
//       }
//       if (locations.length > 0) {
//         locations.forEach((location) => {
//           this.markers.push(this.setMark(location, options));
//         });
//       }
//     },
//   }
// }